<template lang="html">
  <div class="examine">
    <div class="breadNav">
      <el-breadcrumb separator="/" class="">
        <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/hold' }">待办业务</el-breadcrumb-item>
        <el-breadcrumb-item>反馈</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="examineMenu">
      <el-steps :space="200" :active="state">
        <el-step title="等待处理"></el-step>
        <el-step title="处理中"></el-step>
        <el-step title="已办结"></el-step>
        <el-step title="已回访"></el-step>
      </el-steps>
      <div class="exslider">
        <template>
          <el-table
            :data="tableData1"
            style="width: 100%">
            <el-table-column
              prop="date"
              label="用户信息"
              width="120">
            </el-table-column>
            <el-table-column
              prop="name"
              label="">
            </el-table-column>
          </el-table>
        </template>
      </div>
      <div class="exslider">
        <template>
          <el-table
            :data="tableData2"
            style="width: 100%">
            <el-table-column
              prop="title"
              label="诉求信息"
              width="120">
            </el-table-column>
            <el-table-column
              prop="name"
              label="">
            </el-table-column>
          </el-table>
        </template>
      </div>
      <div class="exform">
        <el-form ref="form">
          <el-form-item label="反馈">
             <el-select v-model="type" placeholder="请选择反馈状态">
               <el-option label="执行中" value="执行中"></el-option>
               <el-option label="已完成" value="已完成"></el-option>
               <el-option label="已撤销" value="已撤销"></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="">
             <el-input type="textarea" v-model="description" :rows="4" placeholder="请输入备注"></el-input>
           </el-form-item>
           <el-form-item>
            <el-button type="primary" @click="onSubmit">立即提交</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'examine',
  props: [
    'user',
    'custype'
  ],
  data() {
    return {
      state: 1,
      tableData1: [],
      tableData2: [],
      list:[],
      appealbillbum:'',
      type:'',
      description:''
    }
  },
  methods:{
    onSubmit(){
      var data = {
        method:'feedbackappeal',
        origin:'WarmAppealService',
        company:this.company,
        appealbillbum:this.appealbillbum,
        state:this.type,
        operator:this.user,
        handlecontent:this.description,
        custype:this.custype
      }
      //origin,company,appealbillnum,state,handlecontent,operator,custype
      const _this = this;
      this.post(this.jholdUrl,data,function(res){
        if(res.Result == 0){
          _this.$alert('操作成功', '提示', {
            confirmButtonText: '确定',
            callback: action => {
              _this.$router.push('/hold')
            }
          });
        }
      })
    }
  },
  created() {
    let info = JSON.parse(localStorage.appealinfo);

    if (info.State == 0) { //工单状态进度 0提交诉求单 1审核通过 -1审核未通过 2已派工 3维修中 4待回访 5已结束
      this.state = 1
    } else if (info.State == 1 || info.State == -1 || info.State == 2 || info.State == 3) {
      this.state = 2
    } else if (info.State == 4) {
      this.state = 3
    } else if (info.State == 5) {
      this.state = 4
    }


    this.tableData1 = [ {
      date: '用户姓名',
      name: info.ContactPerson
    }, {
      date: '联系方式',
      name: info.ContactTel
    }, {
      date: '地址',
      name: (info.BuildingName == null || info.RoomNum == null)?'无':(info.BuildingName+' '+info.RoomNum)
    }, {
      date: '供热卡号',
      name: (info.CardNum == null)?'无':(info.CardNum)
    }, {
      date: '供热公司',
      name: info.CusName
    }, {
      date: '提交时间',
      name: info.AddTime
    }]

    this.AppealContent = info.AppealContent

    this.tableData2 = [ {
      title: '诉求类型',
      name: info.Type
    }, {
      title: '诉求项目',
      name: info.Item
    },{
      title: '描述',
      name: info.AppealContent
    }]

    this.appealbillbum = info.AppealNum

  }
}
</script>

<style lang="css">
.examineMenu{
  padding: 0 20px 20px 20px
}
.exslider{
  margin-top: 20px
}
.exform{
  margin-top: 20px
}
.exbtn{
  width: 100%;
  padding: 10px 0 60px 0
}
.exbtn button{
  float: right;
}
</style>
